<!--

    Copyright (c) 2015 Codenvy, S.A.
    All rights reserved. This program and the accompanying materials
    are made available under the terms of the Eclipse Public License v1.0
    which accompanies this distribution, and is available at
    http://www.eclipse.org/legal/epl-v10.html

    Contributors:
      Codenvy, S.A. - initial API and implementation

-->
<che-toolbar che-title="All projects"
             che-add-button-name="New Project"
             che-add-button-href="#/create-project"
             che-dropdown-menu="listProjectsCtrl.menuOptions"
             che-search-placeholder="Search for projects"
             che-search-model="listProjectsCtrl.projectFilter.name"
             che-event-logger="projects/new.project"></che-toolbar>
<div ng-if="listProjectsCtrl.displayWorkspaceFilter" class="projects-filter-animation projects-filter-panel" layout="row"
     layout-align="start center">
  <div class="projects-list-projects-filter-workspace-label">Filter workspaces:</div>
  <div flex="60" layout="row" layout-align="start center" layout-wrap>
    <div class="projects-list-projects-select-workspace" ng-repeat="workspace in listProjectsCtrl.workspaces">
      <md-checkbox ng-model="listProjectsCtrl.filtersWorkspaceSelected[workspace.id]"
                   aria-label="Workspace {{workspace.config.name}}">{{workspace.config.name}}
      </md-checkbox>
    </div>
  </div>
  <div flex layout="row" layout-wrap layout-align="end center"><span class="projects-list-projects-filter-action"
                                                                     ng-click="listProjectsCtrl.resetWorkspaceFilter()">Clear</span><i
    ng-click="listProjectsCtrl.hideWorkspaceFilter()"
    class="projects-list-projects-filter-action-icon material-design icon-ic_close_24px"></i></div>
</div>

<md-content md-scroll-y flex layout="column" class="projects-list-projects" md-theme="maincontent-theme">
  <md-progress-linear md-mode="indeterminate" class="projects-list-projects-progress"
                      ng-show="listProjectsCtrl.isLoading"></md-progress-linear>

  <md-content flex ng-hide="listProjectsCtrl.isLoading">
    <div ng-if="listProjectsCtrl.projects.length === 0" layout="row" layout-align="center center" class="projects-empty-list">
      <che-empty-state che-value="There are no projects yet."
                       che-icon-class="fa fa-folder-open icon"></che-empty-state>
    </div>
    <div
      ng-if="listProjectsCtrl.projects.length > 0"
      ng-repeat="(workspaceId, projects) in listProjectsCtrl.projectsPerWorkspace | listProjectWorkspaceFilter:listProjectsCtrl.filtersWorkspaceSelected">
      <che-list-title che-icon="fa fa-folder">
        <span class="projects-list-workspace-name">{{listProjectsCtrl.getWorkspaceName(workspaceId)}}</span>
        <span ng-show="projects.length == 0" class="project-list-empty">- No projects inside</span>
        <span ng-show="(projects | filter:listProjectsCtrl.projectFilter).length == 0 && projects.length > 0" class="project-list-empty">- No projects found</span>
      </che-list-title>
      <che-list ng-show="(projects | filter:listProjectsCtrl.projectFilter).length > 0">
        <che-project-item ng-repeat="project in projects | filter:listProjectsCtrl.projectFilter"
                           ng-model="listProjectsCtrl.projectsSelectedStatus[project.workspaceId + project.path]"
                           che-selectable="true"
                           che-project-item-workspace-id="workspaceId"
                           che-project-item-workspace-name="listProjectsCtrl.getWorkspaceName(workspaceId)"
                           che-project-item-project="project"
                           che-profile-creation-date="listProjectsCtrl.profileCreationDate"></che-project-item>
      </che-list>
    </div>
  </md-content>
</md-content>
